<!-- https://docs.camunda.org/manual/latest/reference/bpmn20/events/timer-events/ -->
<template>
  <div>
    <FormItemSelect
      v-model="timer.timerDefinitionType"
      :options="timerDefinitionTypes"
      label="Type"
      placeholder="Timer Definition Type"
    />
    <FormItemInput
      v-if="timer.timerDefinitionType"
      v-model="timer.timerDefinition"
      :label="timerDefinitionTypes.find(item => item.value === timer.timerDefinitionType).name"
    />
  </div>
</template>

<script>
import FormItemSelect from '../../ui/FormItemSelect'
import FormItemInput from '../../ui/FormItemInput'
import { TIMER_DEFINITION_TYPES } from '../../../utils/constants'

export default {
  name: 'Timer',
  components: {
    FormItemSelect,
    FormItemInput
  },
  props: {
    value: {
      type: Object,
      required: true
    }
  },
  data() {
    return {
      timerDefinitionTypes: TIMER_DEFINITION_TYPES,
      timer: Object.assign({}, this.value)
    }
  },
  watch: {
    'timer.timerDefinitionType'(newVal, oldVal) {
      this.timer.oldType = oldVal
      this.timer.timerDefinition = undefined
    },
    'timer.timerDefinition'() {
      this.$emit('save-timer-definition', this.timer)
    }
  }
}
</script>
